<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="__PUBLIC__/font-awesome/css/font-awesome.min.css" media="all"/>
    <link rel="stylesheet" href="__CSS__/admin.css" media="all">
    <style type="text/css">

        /* tooltip */
        #tooltip {
            position: absolute;
            border: 1px solid #ccc;
            background: #333;
            padding: 2px;
            display: none;
            color: #fff;
        }
    </style>
</head>
<body style="padding:10px;">
<div class="tplay-body-div">
    <div class="layui-tab">
        <ul class="layui-tab-title">
            <li class="layui-this">商品管理</li>
            <li><a href="{:url('admin/goods/publish')}" class="a_menu">新增商品</a></li>
        </ul>
    </div>
    <form class="layui-form search" action="{:url('admin/goods/index')}" method="post">
        <div class="layui-form-item" style="float: left;">
            <div class="layui-input-inline">
                <input type="text" name="goods_name" lay-verify="" autocomplete="off" placeholder="请输入商品标题" class="layui-input layui-btn-sm"{notempty name="$post.goods_name"
                       }value="{$post.goods_name}" {/notempty}>
            </div>
            <button class="layui-btn layui-btn-danger layui-btn-sm" lay-submit="" lay-filter="serch">立即提交</button>
            <a href="" class="layui-btn layui-btn-sm" style="margin-right: 0;font-size:12px;">刷新</a>
        </div>
    </form>
    <table class="layui-table" lay-size="sm">
        <thead>
        <tr>
            <th>ID</th>
            <th>商品标题</th>
            <th>商品价格</th>
            <th>划线价格</th>
            <th>图片</th>
            <th>描述</th>
            <th>初始化销量</th>
            <th>实际销量</th>
            <th>排序</th>
            <th>状态</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        {volist name="admin" id="vo" key="key"}
        <tr>
            <td>{$key}</td>
            <td>{$vo.goods_name}</td>
            <td>{$vo.goods_price}</td>
            <td>{$vo.line_price}</td>
            <td><a href="{$vo.goods_image}" class="tooltip" target="_blank"><img src="{$vo.goods_image}" width="20" height="20"></a></td>
            <td>{$vo.goods_desc}</td>
            <td>{$vo.sales_initial}</td>
            <td>{$vo.sales_actual}</td>
            <td>{$vo.sort}</td>
            <td><a href="javascript:;" style="font-size:18px;" class="status" data-id="{$vo.id}" data-val="{$vo.status}">{eq name="vo.status" value="1"}<i class="fa fa-toggle-on"></i>{else /}<i class="fa fa-toggle-off"></i>{/eq}</a></td>
            <td class="operation-menu">
                <div class="layui-btn-group">
                    <a href="{:url('admin/goods/publish',['id'=>$vo.id])}" class="layui-btn layui-btn-sm"
                       style="margin-right: 0;font-size:12px;">编辑</a>
                    <a href="javascript:;" class="layui-btn layui-btn-danger layui-btn-sm delete" id="{$vo.id}"
                       style="margin-right: 0;font-size:12px;"><i class="layui-icon"></i></a>
                </div>
            </td>
        </tr>
        {/volist}
        </tbody>
    </table>
    <div style="padding:0 20px;">{$admin->render()}</div>
    {include file="public/foot"}
    <script type="text/javascript">

        $('.delete').click(function () {
            var id = $(this).attr('id');
            layer.confirm('确定要删除?', function (index) {
                $.ajax({
                    url: "{:url('admin/goods/delete')}",
                    data: {id: id},
                    success: function (res) {
                        layer.msg(res.msg);
                        if (res.code == 1) {
                            setTimeout(function () {
                                location.href = res.url;
                            }, 1500)
                        }
                    }
                })
            })
        })
    </script>
    <script type="text/javascript">

        $('.status').click(function () {
            var val = $(this).attr('data-val');
            var id = $(this).attr('data-id');
            var i = $(this).find('i');
            var the = $(this);
            if (val == 1) {
                var status = 0;
            } else {
                var status = 1;
            }
            $.ajax({
                type: "post",
                url: "{:url('admin/goods/status')}",
                data: {status: status, id: id},
                success: function (res) {

                    if (res.code == 1) {
                        top();
                        layer.msg(res.msg);
                    } else {
                        layer.msg(res.msg);
                    }
                }
            })

            function top() {
                if (val == 1) {
                    i.attr("class", "fa fa-toggle-off");
                    the.attr('data-val', 0);
                } else {
                    i.attr("class", "fa fa-toggle-on");
                    the.attr('data-val', 1);
                }
            }
        })


    </script>
</div>
</body>
</html>
